<template>
	<!-- <view class="con-item row-warpper">
		<view class="label col-warpper">{{label}}</view>
		<scroll-view :show-scrollbar="true" :scroll-x="true" v-if="html" class="value">
			<view v-html="value"></view>
		</scroll-view>
		<view v-else v-show="!hasSlot" class="value">{{value}}</view>
		<view v-show="hasSlot" class="value">
			<slot></slot>
		</view>
	</view> -->
	<uni-section class="con-item" :title="label" type="line">
		<scroll-view :show-scrollbar="true" :scroll-x="true" v-if="html" class="value">
			<view v-html="value"></view>
		</scroll-view>
		<view v-else v-show="!hasSlot" class="value">
			{{value}}
		</view>
		<view v-show="hasSlot" class="value">
			<slot></slot>
		</view>
	</uni-section>
</template>

<script>
	export default {
		name: "infoTable",
		props: ["label", "value", "html", "hasSlot"],
	}
</script>

<style lang="less">
	.con-item {
		// border: 1px solid #000000;
		// align-items: stretch;
		// margin: 5px 0;

		.label {
			padding: 0 15px;
			width: 30vw;
			display: flex;
			justify-content: center;
		}

		.value {
			padding: 15px;
			// border-left: 1px solid #000000;

			view {
				// padding: 0 5px;
			}
		}
	}
</style>
